﻿#@head() 
#@header()
<title>客户列表</title>
#@aside("user")
<script type="text/javascript" src="#(path)/assets/js/jquery.tmpl.min.js"></script>
<style>
	.box-body{padding:5px !important}
</style>
<div class="content-wrapper">
	<section class="content">
	<div class="nav-tabs-custom">
		#@usersmenu("invites") 
		
		<div class="tab-content">
			<div class="tab-pane active" id="tab_1">
				<div class="input-group margin" style="width:80%;float:left">
					<label style="float:left;margin-top:8px;margin-left:5px;">被邀请人注册时间：</label>
					<input type="text" id="startime" class="form-control" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" style="width:120px;float:left;margin-left:10px;">
					<span style="float:left;margin:5px 5px 0 5px;">—</span> 
					<input type="text" id="endtime" class="form-control" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" style="width:120px;float:left;margin-right:20px;">
					<label style="float:left;margin-top:8px;margin-left:5px;">邀请人用户名：</label>
					<input type="text" id="referee_mobile" style="width:200px;" class="form-control" placeholder="" >
					<label style="float:left;margin-top:8px;margin-left:5px;">被邀请人用户名：</label>
					<input type="text" id="mobile" style="width:200px;" class="form-control" placeholder="" >
					<span style="float:left;margin-left:20px;" class="input-group-btn">
					  <button id="seachuser" type="button" class="btn btn-info btn-flat">搜索</button> 
					</span>
				</div>
				<div class="box-body">
					<table  id="example1" class="table table-striped">
						<thead>
							<tr>
								<th>用户ID</th>
								<th>邀请人用户名</th>
								<th>邀请人姓名</th>
								<th>被邀请人用户名</th> 
								<th>被邀请人姓名</th>
								<th>被邀请人注册时间</th>
								<th>首笔交易名称</th>
								<th>首笔交易金额</th>
							</tr>
						</thead>
						<tbody id="userlist">
							
						</tbody>
					</table>
					<div class="box-footer clearfix">
					  <ul class="pagination pagination-sm no-margin pull-right">
						<li id="userlist1"><a href="#">首页</a></li>
						<li id="userlist2"><a href="#">上一页</a></li>
						<li><a href="#">第<span id="userlist5"></span>页 共<span id="userlist6"></span>页</a></li>
						<li id="userlist3"><a href="#">下一页</a></li>
						<li id="userlist4"><a href="#">尾页</a></li>
					  </ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	</section>
</div>
#@footer()
<script id="userlistall" type="text/x-jquery-tmpl">
	<tr>
		<td>${id}</td>
		<td>${inviter_mobile}</td>
		<td>${inviter_real_name}</td>
		<td>${mobile}</td>
		<td>${real_name}</td>
		<td>${create_time}</td>
		<td>${tradeName}</td>
		<td>${tradeAmount}元</td>
	</tr>
</script>
<script>
 $(document).ready(function(){
	var totalPage = 1;
	var pageNumber = 1;
	var usermobile = "";
	var startime = "";
	var endtime = "";
	pageNumber = 1; 
	var usermobile2='';
	$("#userlist").empty();
	userlist(pageNumber,usermobile,usermobile2,startime,endtime);
	$("#userlist5").html(pageNumber);
	
	$("#userlist1").click(function(){
		$("#userlist").empty();
		pageNumber = 1;
		userlist(pageNumber,usermobile,usermobile2,startime,endtime);
		$("#userlist5").html(pageNumber);
	});
	$("#userlist2").click(function(){
		if(pageNumber==1){
			alert("当前页是首页!");
		}else{
			$("#userlist").empty();
			pageNumber = pageNumber-1;
			userlist(pageNumber,usermobile,usermobile2,startime,endtime);
			$("#userlist5").html(pageNumber);
		}
	});
	$("#userlist3").click(function(){
		if(pageNumber==totalPage){
			alert("当前页是尾页!");
		}else{
		$("#userlist").empty();
			pageNumber = pageNumber +1;
			userlist(pageNumber,usermobile,usermobile2,startime,endtime);
			$("#userlist5").html(pageNumber);
		}
	});
	$("#userlist4").click(function(){
		$("#userlist").empty();
		pageNumber = totalPage;
		userlist(pageNumber,usermobile,usermobile2,startime,endtime);
		$("#userlist5").html(pageNumber);
	});
	$("#seachuser").click(function(){
		$("#userlist").empty();
		pageNumber = 1;
		usermobile = $("#mobile").val();
		startime = $("#startime").val();
		endtime = $("#endtime").val();
		usermobile2 = $("#referee_mobile").val();
		userlist(pageNumber,usermobile,usermobile2,startime,endtime);
		$("#userlist5").html(pageNumber); 
	});
	function userlist(pageNumber,usermobile,usermobile2,startime,endtime){ 
		$.getJSON("/user/refeeres?token=#(session.token??)&page="+pageNumber+"&size=12&type=user&refereeMobile="+usermobile2+"&mobile="+usermobile+"&createTimeStart="+startime+"&createTimeEnd="+endtime, function(userli) {
			console.log(userli);
			totalPage = userli.data.page.totalPage;
			$("#userlist6").html(totalPage); 
			$.each(userli.data.page.list, function(i, item){ 
				var userlist = {tradeAmount:item.tradeAmount,tradeName:item.tradeName,amount:item.amount,create_time:item.create_time,real_name:item.user_real_name,mobile:item.mobile,inviter_real_name:item.referee_real_name,inviter_mobile:item.referee_mobile,id:item.id,create_time:item.referee_create_time};
				$("#userlistall").tmpl(userlist).appendTo('#userlist');
			});
		});	
	}
});
</script> 
</body>
</html>

